<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Css Demo</title>
<!--样式选择器-->
<!--    <style>-->
<!--        #p1{color: #ec7ab0;font-size: 100px;text-align: center}-->
<!--        #top{color: black;font-size: 10px}-->
<!--    </style>-->
    <link rel="stylesheet" href="01css.css">
</head>
<body>
    <h1>welcome</h1>
    <p id="p1">今天天气真热啊</p>
    <div id="top">明天可能会下雨</div>

    <div class="red">
        <p>今天</p>
        <p>明天</p>
        <p>后天</p>
    </div>

    <div class="blue">
        <p>1</p>
        <p>2</p>
        <p>3</p>
    </div>

    <div>
        <label for="name"><br>用户名<input type="text" placeholder="请输入用户名">
        </label>
        <label for="password"><br>密码
        <input type="text" placeholder="请输入密码">
        </label>
    </div>

    <div class="demo">
        <p>我是儿子
            <span>
                我是孙子
        </span>
        </p>
    </div>

    <button>点击我变色</button>
    <a href="https://baidu.com" target="_blank">百度一下</a>

</body>
</html>